﻿<!-- 导入jstl标签库，核心库和格式化库-->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>秒杀</title>
		
		
		<link rel="stylesheet"
			href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
		<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
		      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
		      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
		    <![endif]-->
	</head>
	<body>
		<div class="container">
			<div class="panel panel-default">
			  <!-- Default panel contents -->
			  	<div class="panel-heading">
			  		<h2 style="text-align:center;">秒杀“${seckill.name}”</h2>
			  		<h2 style="text-align:center;color:#aa0000;"><span class="glyphicon glyphicon-time"></span></h2>
			  	</div>
				  <div class="panel-body">
				    	<div style="font-size:24px;text-align:center;" id="seckill-box">
				    		
				    	</div>
				    	<div>
				    		<h2 style="text-align:center;" id="fail-msg"></h2>
				    	</div>
				    	<table class="table" id="table" style="display:none;">
				    		<thead>
				    			<tr>
				    				<th>名称</th>
				    				<th>手机</th>
				    				<th>秒杀时间</th>
				    				<th>秒杀状态</th>
				    				<th>状态</th>
				    			</tr>
				    		</thead>
				    		<tbody>
				    			
				    		</tbody>
				    	</table>
				  </div>
			</div>
		</div>
		<div class="modal fade" id="modal">
		  <div class="modal-dialog">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal"><!-- <span aria-hidden="true">&times;</span><span class="sr-only">Close</span> --></button>
		        <h4 class="modal-title" >请输入手机号</h4>
		      </div>
		      <div class="modal-body">
		        <input class="form-control" id="userPhone" type="text"/>
		      </div>
		      <div class="modal-footer">
		        <span id="msg" style="color:red"></span>
		        <button type="button" class="btn btn-primary" id="btn-phone">提交</button>
		      </div>
		    </div><!-- /.modal-content -->
		  </div><!-- /.modal-dialog -->
		</div><!-- /.modal -->
		
	</body>
	<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
	
	<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
	
	<script src="http://cdn.bootcss.com/jquery.countdown/2.1.0/jquery.countdown.min.js"></script>
	<script src="http://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/static/script/seckill.js"></script>
	<script type="text/javascript">
		$(function(){
			seckill.detail.init({
				seckillId: ${seckill.seckillId},
				startTime: ${seckill.startTime.time},
				endTime:${seckill.endTime.time}
			});
		})
	</script>
</html>